<template>
  <a-dropdown :trigger="['click']">
    <a-avatar :src="avatarStatus !== 'default' ? avatarStatus : ''" size="large" style="margin-right: 20px; cursor: pointer;">
      <template #icon v-if="avatarStatus === 'default'">
        <UserOutlined />
      </template>
      <!-- <CaretDownOutlined /> -->
    </a-avatar>
    <template #overlay>
      <a-menu>
        <a-menu-item>
          <a @click.prevent="outLogin">{{ avatarStatus === 'default' ? '请登录' : '退出登录' }}</a>
        </a-menu-item>
        <!-- <a-menu-item>
          <a href="javascript:;">2nd menu item</a>
        </a-menu-item> -->
      </a-menu>
    </template>
  </a-dropdown>
</template>
<script setup>
import { UserOutlined, CaretDownOutlined } from '@ant-design/icons-vue'
defineProps(['avatarStatus'])
const emit = defineEmits(['outLogin'])
const outLogin = () => {
  emit('outLogin')
}
</script>